<template>
  <el-dialog
    v-model="dialogVisible"
    top="10vh"
    :title="title"
    width="80%"
    :before-close="handelCloseDialog"
  >
    <div class="model-params-box">
      <div class="bottom-model-info">
        <div class="table">
          <div class="btn">
            <div class="model-info">
              <span
                >计算单元计算参数：
                <span class="a-title">{{ paramsName || '' }}</span>
              </span>

              <el-upload
                v-model:file-list="fileList"
                class="upload-demo left-spacing"
                action="#"
                multiple
                :http-request="uploadFile"
                :show-file-list="false"
              >
                <el-button type="primary">导入参数文件</el-button>
              </el-upload>
            </div>
          </div>
          <div class="table-tb">
            <el-tabs v-model="activeNameThird" @tab-click="handleTabsParams">
              <el-tab-pane label="小流域计算参数" name="first">
                <div class="btn-box">
                  <el-button type="primary" v-if="!showEdit" @click="handleParamsModify"
                    >参数修改</el-button
                  >
                  <el-button type="success" v-if="showEdit" @click="handleParamsSave"
                    >保存</el-button
                  >
                  <el-button type="warning" v-if="showEdit" @click="handleParamsClose"
                    >取消</el-button
                  >
                </div>
                <el-table border :data="paramsFirst" style="width: 100%">
                  <el-table-column
                    prop="wscd"
                    label="小流域编码"
                    show-overflow-tooltip
                    width="150"
                    align="center"
                  />
                  <el-table-column
                    prop="hruArea"
                    label="小流域单元面积"
                    show-overflow-tooltip
                    align="center"
                    width="200"
                  />
                  <el-table-column
                    prop="hruElev"
                    label="小流域单元平均高程（米）"
                    show-overflow-tooltip
                    align="center"
                    width="200"
                  />
                  <el-table-column
                    prop="soilTypeName"
                    label="小流域单元主要土壤类型"
                    show-overflow-tooltip
                    align="center"
                    width="200"
                  />
                  <el-table-column
                    prop="impervStorMax"
                    label="洼地平均蓄水量[mm]"
                    show-overflow-tooltip
                    align="center"
                    width="200"
                  />
                  <el-table-column
                    prop="covdenSum"
                    label="夏季植被覆盖密度[%]"
                    show-overflow-tooltip
                    align="center"
                    width="200"
                  />
                  <el-table-column
                    prop="srainIntcp"
                    label="夏季主要植被类型的截流能力[mm]"
                    show-overflow-tooltip
                    align="center"
                    width="300"
                  />
                  <el-table-column
                    prop="covdenWin"
                    label="冬季植被覆盖密度[%]"
                    show-overflow-tooltip
                    align="center"
                    width="200"
                  />
                  <el-table-column
                    prop="snowIntcp"
                    label="冬季主要植被类型的截流能力[mm]"
                    show-overflow-tooltip
                    align="center"
                    width="300"
                  />
                  <el-table-column
                    prop="hruGenTypeName"
                    label="响应单元编号"
                    show-overflow-tooltip
                    align="center"
                    width="100"
                  />
                  <el-table-column
                    prop="soil2gwMax"
                    label="土壤向地下水渗漏系数"
                    align="center"
                    width="200"
                  >
                    <template #default="{ row }">
                      <div class="item">
                        <el-input
                          v-if="showEdit"
                          class="item__input"
                          v-model="row.soil2gwMax"
                          placeholder="请输入内容"
                        ></el-input>
                        <div class="item__txt" v-else>{{ row.soil2gwMax }}</div>
                      </div>
                    </template>
                  </el-table-column>
                  <el-table-column
                    prop="slowcoefLin"
                    label="慢速壤中流线性系数"
                    align="center"
                    width="200"
                  >
                    <template #default="{ row }">
                      <div class="item">
                        <el-input
                          v-if="showEdit"
                          class="item__input"
                          v-model="row.slowcoefLin"
                          placeholder="请输入内容"
                        ></el-input>
                        <div class="item__txt" v-else>{{ row.slowcoefLin }}</div>
                      </div>
                    </template>
                  </el-table-column>
                  <el-table-column
                    prop="slowcoefSq"
                    label="慢速壤中流非线性系数"
                    align="center"
                    width="300"
                  >
                    <template #default="{ row }">
                      <div class="item">
                        <el-input
                          v-if="showEdit"
                          class="item__input"
                          v-model="row.slowcoefSq"
                          placeholder="请输入内容"
                        ></el-input>
                        <div class="item__txt" v-else>{{ row.slowcoefSq }}</div>
                      </div>
                    </template>
                  </el-table-column>
                  <el-table-column
                    prop="prefFlowDen"
                    label="土壤区用于地下水优先流的水分比例"
                    align="center"
                    width="300"
                  >
                    <template #default="{ row }">
                      <div class="item">
                        <el-input
                          v-if="showEdit"
                          class="item__input"
                          v-model="row.prefFlowDen"
                          placeholder="请输入内容"
                        ></el-input>
                        <div class="item__txt" v-else>{{ row.prefFlowDen }}</div>
                      </div>
                    </template>
                  </el-table-column>
                  <el-table-column
                    prop="fastcoefLin"
                    label="快速壤中流线性系数"
                    align="center"
                    width="200"
                  >
                    <template #default="{ row }">
                      <div class="item">
                        <el-input
                          v-if="showEdit"
                          class="item__input"
                          v-model="row.fastcoefLin"
                          placeholder="请输入内容"
                        ></el-input>
                        <div class="item__txt" v-else>{{ row.fastcoefLin }}</div>
                      </div>
                    </template>
                  </el-table-column>
                  <el-table-column
                    prop="fastcoefSq"
                    label="快速壤中流非线性系数"
                    align="center"
                    width="200"
                  >
                    <template #default="{ row }">
                      <div class="item">
                        <el-input
                          v-if="showEdit"
                          class="item__input"
                          v-model="row.fastcoefSq"
                          placeholder="请输入内容"
                        ></el-input>
                        <div class="item__txt" v-else>{{ row.fastcoefSq }}</div>
                      </div>
                    </template>
                  </el-table-column>
                  <el-table-column
                    prop="conductivity"
                    label="饱和水力传导度"
                    align="center"
                    width="200"
                  >
                    <template #default="{ row }">
                      <div class="item">
                        <el-input
                          v-if="showEdit"
                          class="item__input"
                          v-model="row.conductivity"
                          placeholder="请输入内容"
                        ></el-input>
                        <div class="item__txt" v-else>{{ row.conductivity }}</div>
                      </div>
                    </template>
                  </el-table-column>
                  <el-table-column
                    prop="porosity"
                    label="孔隙率"
                    show-overflow-tooltip
                    align="center"
                  />
                  <el-table-column
                    prop="residualSaturation"
                    label="残余含水量"
                    show-overflow-tooltip
                    align="center"
                    width="150"
                  />
                  <el-table-column
                    prop="vgAlpha"
                    label="VG模型alpha"
                    show-overflow-tooltip
                    align="center"
                    width="150"
                  />
                  <el-table-column
                    prop="vgN"
                    label="VG模型n"
                    show-overflow-tooltip
                    align="center"
                    width="150"
                  />
                  <el-table-column
                    prop="layerTopDepth"
                    label="上层土壤厚度"
                    align="center"
                    width="150"
                  >
                    <template #default="{ row }">
                      <div class="item">
                        <el-input
                          v-if="showEdit"
                          class="item__input"
                          v-model="row.layerTopDepth"
                          placeholder="请输入内容"
                        ></el-input>
                        <div class="item__txt" v-else>{{ row.layerTopDepth }}</div>
                      </div>
                    </template>
                  </el-table-column>
                  <el-table-column prop="layerDepth" label="土壤厚度" align="center" width="150">
                    <template #default="{ row }">
                      <div class="item">
                        <el-input
                          v-if="showEdit"
                          class="item__input"
                          v-model="row.layerDepth"
                          placeholder="请输入内容"
                        ></el-input>
                        <div class="item__txt" v-else>{{ row.layerDepth }}</div>
                      </div>
                    </template>
                  </el-table-column>
                  <el-table-column
                    prop="initialWaterContent"
                    label="初始土壤含水率"
                    show-overflow-tooltip
                    align="center"
                    width="150"
                  >
                    <template #default="{ row }">
                      <div class="item">
                        <el-input
                          v-if="showEdit"
                          class="item__input"
                          v-model="row.initialWaterContent"
                          placeholder="请输入内容"
                        ></el-input>
                        <div class="item__txt" v-else>{{ row.initialWaterContent }}</div>
                      </div>
                    </template>
                  </el-table-column>
                  <el-table-column
                    prop="fieldCapacity"
                    label="田间持水量"
                    show-overflow-tooltip
                    align="center"
                    width="150"
                  />
                  <el-table-column
                    prop="dprstDepth"
                    label="dprst厚度"
                    show-overflow-tooltip
                    align="center"
                    width="150"
                  />
                  <el-table-column
                    prop="dprstStorageInit"
                    label="dprst初始流量"
                    show-overflow-tooltip
                    align="center"
                    width="150"
                  />
                </el-table>
              </el-tab-pane>
              <el-tab-pane label="河道计算参数" name="second">
                <div class="btn-box">
                  <el-button type="primary" v-if="!showEdit" @click="handleParamsModify"
                    >参数修改</el-button
                  >
                  <el-button type="success" v-if="showEdit" @click="handleParamsSave"
                    >保存</el-button
                  >
                  <el-button type="warning" v-if="showEdit" @click="handleParamsClose"
                    >取消</el-button
                  >
                </div>
                <el-table border :data="paramsSecond" style="width: 100%">
                  <el-table-column
                    prop="rvcd"
                    label="河段编码"
                    show-overflow-tooltip
                    align="center"
                    width="150"
                  />
                  <el-table-column prop="chanAlpha" label="运动波参数α" align="center" width="150">
                    <template #default="{ row }">
                      <div class="item">
                        <el-input
                          v-if="showEdit"
                          class="item__input"
                          v-model="row.chanAlpha"
                          placeholder="请输入内容"
                        ></el-input>
                        <div class="item__txt" v-else>{{ row.chanAlpha }}</div>
                      </div>
                    </template>
                  </el-table-column>
                  <el-table-column prop="chanCmp" label="运动波参数m" align="center" width="150">
                    <template #default="{ row }">
                      <div class="item">
                        <el-input
                          v-if="showEdit"
                          class="item__input"
                          v-model="row.chanCmp"
                          placeholder="请输入内容"
                        ></el-input>
                        <div class="item__txt" v-else>{{ row.chanCmp }}</div>
                      </div>
                    </template>
                  </el-table-column>
                  <el-table-column
                    prop="chanLength"
                    label="河段长度"
                    show-overflow-tooltip
                    align="center"
                    width="150"
                  />
                  <el-table-column
                    prop="chanNdx"
                    label="坡面汇流参数"
                    show-overflow-tooltip
                    align="center"
                    width="150"
                  />
                  <el-table-column
                    prop="chanRough"
                    label="曼宁系数"
                    show-overflow-tooltip
                    align="center"
                    width="150"
                  />
                  <el-table-column
                    prop="chanRouteTime"
                    label="运动波系数演进时间"
                    show-overflow-tooltip
                    align="center"
                    width="200"
                  />
                  <el-table-column
                    prop="chanSlope"
                    label="河底比降"
                    show-overflow-tooltip
                    align="center"
                    width="150"
                  />
                  <el-table-column
                    prop="chanT3Lbratio"
                    label="左岸系数"
                    show-overflow-tooltip
                    align="center"
                    width="150"
                  />
                  <el-table-column
                    prop="chanT3Rbratio"
                    label="右岸系数"
                    show-overflow-tooltip
                    align="center"
                    width="150"
                  />
                  <el-table-column
                    prop="chanThresh"
                    label="河段运动波系数thresh"
                    show-overflow-tooltip
                    align="center"
                    width="200"
                  />

                  <el-table-column prop="chanType" label="河段类型" align="center" width="150">
                    <template #default="{ row }">
                      <div class="item">
                        <el-input
                          v-if="showEdit"
                          class="item__input"
                          v-model="row.chanType"
                          placeholder="请输入内容"
                        ></el-input>
                        <div class="item__txt" v-else>{{ row.chanType }}</div>
                      </div>
                    </template>
                  </el-table-column>
                  <el-table-column
                    prop="chanWidth"
                    label="河宽"
                    show-overflow-tooltip
                    align="center"
                  />

                  <el-table-column
                    prop="resInit"
                    label="水库的汇流参数-水库初始蓄水量"
                    show-overflow-tooltip
                    align="center"
                    width="250"
                  />
                  <el-table-column
                    prop="resLow"
                    label="水库的汇流参数-死库容"
                    show-overflow-tooltip
                    align="center"
                    width="200"
                  />
                  <el-table-column
                    prop="resUp"
                    label="水库的汇流参数-最大库容"
                    show-overflow-tooltip
                    align="center"
                    width="200"
                  />
                  <el-table-column
                    prop="chanQInit"
                    label="河道初始流量"
                    show-overflow-tooltip
                    align="center"
                    width="150"
                  />
                  <el-table-column prop="lag" label="滞后时间" align="center" width="150">
                    <template #default="{ row }">
                      <div class="item">
                        <el-input
                          v-if="showEdit"
                          class="item__input"
                          v-model="row.lag"
                          placeholder="请输入内容"
                        ></el-input>
                        <div class="item__txt" v-else>{{ row.lag }}</div>
                      </div>
                    </template>
                  </el-table-column>
                </el-table>
              </el-tab-pane>
              <el-tab-pane label="运动波参数" name="third">
                <div class="btn-box">
                  <el-button type="primary" v-if="!showEdit" @click="handleParamsModify"
                    >参数修改</el-button
                  >
                  <el-button type="success" v-if="showEdit" @click="handleParamsSave"
                    >保存</el-button
                  >
                  <el-button type="warning" v-if="showEdit" @click="handleParamsClose"
                    >取消</el-button
                  >
                </div>
                <el-table border :data="paramsThird" style="width: 100%">
                  <el-table-column
                    prop="wscd"
                    label="小流域编码"
                    show-overflow-tooltip
                    align="center"
                    width="150"
                  />
                  <el-table-column
                    prop="ofpAlpha"
                    label="运动波坡面汇流参数α"
                    align="center"
                    width="200"
                  >
                    <template #default="{ row }">
                      <div class="item">
                        <el-input
                          v-if="showEdit"
                          class="item__input"
                          v-model="row.ofpAlpha"
                          placeholder="请输入内容"
                        ></el-input>
                        <div class="item__txt" v-else>{{ row.ofpAlpha }}</div>
                      </div>
                    </template>
                  </el-table-column>
                  <el-table-column
                    prop="ofpCmp"
                    label="运动波坡面汇流参数m"
                    align="center"
                    width="200"
                  >
                    <template #default="{ row }">
                      <div class="item">
                        <el-input
                          v-if="showEdit"
                          class="item__input"
                          v-model="row.ofpCmp"
                          placeholder="请输入内容"
                        ></el-input>
                        <div class="item__txt" v-else>{{ row.ofpCmp }}</div>
                      </div>
                    </template>
                  </el-table-column>
                  <el-table-column
                    prop="ofpHru"
                    label="汇流坡面对应的hru计算单元"
                    show-overflow-tooltip
                    align="center"
                    width="250"
                  />
                  <el-table-column
                    prop="ofpImpareaPercent"
                    label="坡面不透水面积百分比"
                    show-overflow-tooltip
                    align="center"
                    width="200"
                  />
                  <el-table-column
                    prop="ofpImpvAlpha"
                    label="坡面不透水面积的运动波汇流参数α"
                    show-overflow-tooltip
                    align="center"
                    width="250"
                  />
                  <el-table-column
                    prop="ofpImpvCmp"
                    label="坡面不透水面积的运动波汇流参数m"
                    show-overflow-tooltip
                    align="center"
                    width="250"
                  />
                  <el-table-column
                    prop="ofpLength"
                    label="运动波汇流长度"
                    show-overflow-tooltip
                    align="center"
                    width="200"
                  />
                  <el-table-column
                    prop="ofpNdx"
                    label="是否有坡面汇流"
                    show-overflow-tooltip
                    align="center"
                    width="150"
                  />
                  <el-table-column
                    prop="ofpRough"
                    label="运动波系数rough"
                    show-overflow-tooltip
                    align="center"
                    width="150"
                  />

                  <el-table-column
                    prop="ofpRouteTime"
                    label="运动波系数演进时间"
                    show-overflow-tooltip
                    align="center"
                    width="200"
                  />
                  <el-table-column
                    prop="ofpSlope"
                    label="运动波系数坡度"
                    show-overflow-tooltip
                    align="center"
                    width="150"
                  />
                  <el-table-column
                    prop="ofpThresh"
                    label="运动波系数thresh"
                    show-overflow-tooltip
                    align="center"
                    width="150"
                  />
                  <el-table-column
                    prop="ofpType"
                    label="运动波系数坡面类型"
                    align="center"
                    width="200"
                  />
                  <el-table-column prop="tb" label="运动波系数Tb" align="center" width="150">
                    <template #default="{ row }">
                      <div class="item">
                        <el-input
                          v-if="showEdit"
                          class="item__input"
                          v-model="row.tb"
                          placeholder="请输入内容"
                        ></el-input>
                        <div class="item__txt" v-else>{{ row.tb }}</div>
                      </div>
                    </template>
                  </el-table-column>
                  <el-table-column prop="tp" label="运动波系数Tp" align="center" width="150">
                    <template #default="{ row }">
                      <div class="item">
                        <el-input
                          v-if="showEdit"
                          class="item__input"
                          v-model="row.tp"
                          placeholder="请输入内容"
                        ></el-input>
                        <div class="item__txt" v-else>{{ row.tp }}</div>
                      </div>
                    </template>
                  </el-table-column>
                </el-table>
              </el-tab-pane>
              <el-tab-pane label="壤中流参数" name="five">
                <div class="btn-box">
                  <el-button type="primary" v-if="!showEdit" @click="handleParamsModify"
                    >参数修改</el-button
                  >
                  <el-button type="success" v-if="showEdit" @click="handleParamsSave"
                    >保存</el-button
                  >
                  <el-button type="warning" v-if="showEdit" @click="handleParamsClose"
                    >取消</el-button
                  >
                </div>
                <el-table border :data="paramsFive" style="width: 100%">
                  <el-table-column
                    prop="ssstorInit"
                    label="重力水库含水量初值"
                    align="center"
                    width="300"
                  >
                    <template #default="{ row }">
                      <div class="item">
                        <el-input
                          v-if="showEdit"
                          class="item__input"
                          v-model="row.ssstorInit"
                          placeholder="请输入内容"
                        ></el-input>
                        <div class="item__txt" v-else>{{ row.ssstorInit }}</div>
                      </div>
                    </template>
                  </el-table-column>
                  <el-table-column
                    prop="ssr2gwExp"
                    label="重力水库向地下水库出流的非线性参数"
                    align="center"
                  >
                    <template #default="{ row }">
                      <div class="item">
                        <el-input
                          v-if="showEdit"
                          class="item__input"
                          v-model="row.ssr2gwExp"
                          placeholder="请输入内容"
                        ></el-input>
                        <div class="item__txt" v-else>{{ row.ssr2gwExp }}</div>
                      </div>
                    </template>
                  </el-table-column>
                  <el-table-column
                    prop="ssr2gwRate"
                    label="重力水库向地下水库出流的线性参数"
                    align="center"
                  >
                    <template #default="{ row }">
                      <div class="item">
                        <el-input
                          v-if="showEdit"
                          class="item__input"
                          v-model="row.ssr2gwRate"
                          placeholder="请输入内容"
                        ></el-input>
                        <div class="item__txt" v-else>{{ row.ssr2gwRate }}</div>
                      </div>
                    </template>
                  </el-table-column>
                </el-table>
              </el-tab-pane>
              <el-tab-pane label="地下水库参数" name="fourth">
                <div class="btn-box">
                  <el-button type="primary" v-if="!showEdit" @click="handleParamsModify"
                    >参数修改</el-button
                  >
                  <el-button type="success" v-if="showEdit" @click="handleParamsSave"
                    >保存</el-button
                  >
                  <el-button type="warning" v-if="showEdit" @click="handleParamsClose"
                    >取消</el-button
                  >
                </div>
                <el-table border :data="paramsFourth" style="width: 100%">
                  <el-table-column prop="wscd" label="小流域编码" align="center" />
                  <el-table-column prop="gwflowCoef" label="产流系数" align="center">
                    <template #default="{ row }">
                      <div class="item">
                        <el-input
                          v-if="showEdit"
                          class="item__input"
                          v-model="row.gwflowCoef"
                          placeholder="请输入内容"
                        ></el-input>
                        <div class="item__txt" v-else>{{ row.gwflowCoef }}</div>
                      </div>
                    </template>
                  </el-table-column>
                  <el-table-column prop="gwsinkCoef" label="渗漏系数" align="center">
                    <template #default="{ row }">
                      <div class="item">
                        <el-input
                          v-if="showEdit"
                          class="item__input"
                          v-model="row.gwsinkCoef"
                          placeholder="请输入内容"
                        ></el-input>
                        <div class="item__txt" v-else>{{ row.gwsinkCoef }}</div>
                      </div>
                    </template>
                  </el-table-column>
                  <el-table-column prop="gwstorInit" label="初始含水量" align="center">
                    <template #default="{ row }">
                      <div class="item">
                        <el-input
                          v-if="showEdit"
                          class="item__input"
                          v-model="row.gwstorInit"
                          placeholder="请输入内容"
                        ></el-input>
                        <div class="item__txt" v-else>{{ row.gwstorInit }}</div>
                      </div>
                    </template>
                  </el-table-column>
                </el-table>
              </el-tab-pane>
            </el-tabs>
          </div>
        </div>
      </div>
    </div>
    <!-- <el-form ref="ruleFormRef" :rules="rules" :model="form1" label-width="140px" size="default"> -->

    <!-- <template #footer>
        <span class="dialog-footer">
          <el-button type="primary" @click="handleSaveModelParams"> 确定 </el-button>
          <el-button @click="closeDialog()">取消</el-button>
        </span>
      </template> -->
  </el-dialog>
</template>

<script setup>
import { ref } from 'vue'
import {
  // 上传时空变源参数文件
  uploadSkby,
  // 上传后保存参数
  saveParams,
  // 查看时空变源-流域参数
  getParamsWata,
  // 查看时空变源-河道参数
  getParamsRiver,
  // 查看时空变源-运动波参数
  getParamsNofpl,
  // 查看时空变源-地下水库参数
  getParamsNgw,
  //查看时空变源-嚷中流参数
  paramsNssr,
  modifyParamsWata,
  modifyParamsRiver,
  modifyParamsNofpl,
  modifyParamsNgw,
  modifyParamsNssr
} from '@/services/modules/model-config'
const dialogVisible = ref(false)

const title = ref('模型参数')
// 参数方案名称
const paramsName = ref('')
const fileList = ref([])
const scid = ref('')
const paramsId = ref('')
const showEdit = ref(false)
const activeNameThird = ref('first')
// 时空变源-流域参数
const paramsFirst = ref([])
// 时空变源-河道参数
const paramsSecond = ref([])
// 时空变源-运动波参数
const paramsThird = ref([])
// 时空变源-地下水库参数
const paramsFourth = ref([])
// 时空变源-壤中流参数
const paramsFive = ref([])
const props = defineProps({
  dialogVisible: {
    type: Boolean,
    default: false
  }
})
const emit = defineEmits(['handleBackClickChangeVal', 'handleSaveBack'])
//上传csv格式 上传参数文件
async function uploadFile(params) {
  var { file } = params
  var formData = new FormData()
  formData.append('file', file)
  let res = await uploadSkby(formData)
  if (res.code == 200) {
    ElMessage({
      type: 'success',
      message: res.msg
    })
    let params = {
      scid: scid,
      pmUrl: res.data.url,
      id: paramsId.value || undefined
    }
    saveParams(params).then((res) => {
      if (res.code === 200) {
        // 参数文件上传 并保存成功后 回调父组件的选择参数配置函数 重新获取
        emit('handleBackClickChangeVal', scid)
      }
    })
  }
}

// 打开弹框
const handleOpenModelParams = (paramsN, Scid, ParamsId) => {
  paramsName.value = paramsN
  scid.value = Scid
  paramsId.value = ParamsId
  dialogVisible.value = true
  acceptParamsWata()
  acceptParamsRiver()
  acceptParamsNofpl()
  acceptParamsNgw()
  acceptParamsNssr()
}
// 关于参数修改部分
function handleParamsModify() {
  showEdit.value = true
}
// 参数保存
function handleParamsSave() {
  showEdit.value = false
  switch (activeNameThird.value) {
    case 'first':
      modifyParamsWata(paramsFirst.value).then((res) => {
        if (res.code === 200) {
          // 查看时空变源-流域参数
          acceptParamsWata()
        }
      })
      break
    case 'second':
      modifyParamsRiver(paramsSecond.value).then((res) => {
        if (res.code === 200) {
          // 查看时空变源-河道参数
          acceptParamsRiver()
        }
      })
      break
    case 'third':
      modifyParamsNofpl(paramsThird.value).then((res) => {
        if (res.code === 200) {
          // 查看时空变源-运动波参数
          acceptParamsNofpl()
        }
      })
      break
    case 'fourth':
      modifyParamsNgw(paramsFourth.value).then((res) => {
        if (res.code === 200) {
          // 查看时空变源-地下水库参数
          acceptParamsNgw()
        }
      })
      break
    case 'five':
      modifyParamsNssr(paramsFive.value).then((res) => {
        if (res.code === 200) {
          //  查看时空变源-嚷中流参数
          acceptParamsNssr()
        }
      })
      break

    default:
      break
  }
  // 弹框点击保存后 发射出一个事件 让父组件刷新保存的数据
  emit('handleSaveBack', activeNameThird.value)
}
const handleTabsParams = () => {
  handleParamsClose()
}
// 参数修改后未点击保存直接点击取消
const handleParamsClose = () => {
  showEdit.value = false
  switch (activeNameThird.value) {
    case 'first':
      // 查看时空变源-流域参数
      acceptParamsWata()
      break
    case 'second':
      // 查看时空变源-河道参数
      acceptParamsRiver()
      break
    case 'third':
      // 查看时空变源-运动波参数
      acceptParamsNofpl()
      break
    case 'fourth':
      // 查看时空变源-地下水库参数
      acceptParamsNgw()
      break
    case 'five':
      //  查看时空变源-嚷中流参数
      acceptParamsNssr()

      break
    default:
      break
  }
}
// 查看时空变源-流域参数
const acceptParamsWata = () => {
  getParamsWata({ pmid: paramsId.value }).then((res) => {
    if (res.code == 200) {
      paramsFirst.value = res.data
    }
  })
}

// 查看时空变源-河道参数
const acceptParamsRiver = () => {
  getParamsRiver({ pmid: paramsId.value }).then((res) => {
    if (res.code == 200) {
      paramsSecond.value = res.data
    }
  })
}

// 查看时空变源-运动波参数
const acceptParamsNofpl = () => {
  getParamsNofpl({ pmid: paramsId.value }).then((res) => {
    if (res.code == 200) {
      paramsThird.value = res.data
    }
  })
}

// 查看时空变源-地下水库参数
const acceptParamsNgw = () => {
  getParamsNgw({ pmid: paramsId.value }).then((res) => {
    if (res.code == 200) {
      paramsFourth.value = res.data
    }
  })
}

//  查看时空变源-嚷中流参数
const acceptParamsNssr = () => {
  paramsNssr({ pmid: paramsId.value }).then((res) => {
    if (res.code == 200) {
      paramsFive.value = res.data
    }
  })
}

// 关闭弹框回调
const handelCloseDialog = () => {
  dialogVisible.value = false
}

defineExpose({ handleOpenModelParams })
</script>

<style lang="less" scoped>
.model-params-box {
  height: 75vh;
  .bottom-model-info {
    width: 100%;
    height: 100%;
    .model-info {
      display: flex;
      justify-content: space-between;
      width: 100%;
    }
    .table {
      height: 100%;
      margin: 0 !important;
      .btn {
        height: 40px;
      }
      .table-tb {
        height: calc(100% - 40px);
        .el-tabs {
          height: 100%;
          :deep(.el-tabs__content) {
            height: calc(100% - 50px);
            .el-tab-pane {
              height: 100%;
              .btn-box {
                margin-bottom: 10px;
              }
              .el-table--fit {
                height: calc(100% - 40px);
              }
            }
          }
        }
      }
    }
  }
}
</style>
